<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>打印星星</title>
  </head>
  <body>
    <script>
      //左直角星星
      var star1 = "";
      // 0 1 2 3 4 五个
      for (var i = 0; i < 5; i++) {
        star1 += "*";
        console.log(star1);
      }
      console.log("-------------------");
      // // 1 2 3 4 5 五个
      // for (var i = 1; i <= 5; i++) {
      //   star += "*";
      //   console.log(star1);
      // }
      //-----------------
      //右直角星星
      //观察可得 没行的星星数+空格数始终为5
      var star2 = "";
      //外层循环控制行数，以及每行的星星数
      for (var i = 0; i < 5; i++) {
        var space = ""; //每行星星前的空格；
        for (var j = 0; j < 5 - 1 - i; j++) {
          //内层循环控制空格数
          space += " ";
        }
        star2 += "*";
        console.log(space + star2);
      }
      console.log("-------------------");
      //------------------
      //倒左直角星星
      //观察可得
      /*
            1 5
            2 4
            3 3
            4 2
            5 1
            */
      for (var i = 0; i < 5; i++) {
        // 第一层循环控制行数
        var star3 = "";
        for (var j = 0; j < 5 - i; j++) {
          star3 += "*";
          // 第二层循环控制星星数
        }
        console.log(star3);
      }
      console.log("-------------------");
      //------------------
      //倒右直角星星
      for (var i = 0; i < 5; i++) {
        //第一层第一个循环控制行数
        let star4 = "";
        for (var j = 0; j < 5 - i; j++) {
          //第二层第一个循环控制每层星星数
          star4 += "*";
        }
        var space = "";
        for (var j = 0; j < i; j++) {
          //第二层第二个循环控制每层空格数
          space += " ";
        }
        console.log(space + star4);
      }
      //------------------
      console.log("-------------------");
      //金字塔星星
      for (var i = 0; i < 5; i++) {
        //最外层循环控制行数
        var star5 = "";
        for (var j = 0; j < 2 * i + 1; j++) {
          //第一个循环控制星星数量
          star5 += "*";
        }
        var space = "";
        for (var j = 0; j < 5 - 1 - i; j++) {
          //第二个循环控制空格数量
          space += " ";
        }
        console.log(space + star5);
      }
      /*
            提示
           *      2*1-1
          ***     2*2-1
         *****    2*3-1
        *******   2*4-1
       *********  2*5-1
            */
    </script>
  </body>
</html>
